<template>
  <div  class="content">
    <div class="head">
      <span>流程任务</span>
      
    </div>
    <Table :height="autoheight" stripe border :loading="loading" :columns="tableColumns" :data="tableData"></Table>
    <Page :total="totalSize" :current="page" :page-size="pageSize" @on-change="pageNum" @on-page-size-change="pageSizeChange" ></Page>
    <Modal v-model="modalStart" title="问题处理"  @on-cancel="cancel" cancel-text="取消">
        
        <Form  ref="flowParamsItemRef" label-position="right" :label-width="100" :model="flowParamsItem" >
          <template v-for="(param) in this.taskParamList ">
            <FormItem :label="param.paramName">
                <Input  v-model="flowParamsItem[param.param]"  />
            </FormItem>
          </template>
          <FormItem label="父页面元素">
                <textarea v-model="text" />
          </FormItem>
        </Form>

      <div slot="footer">
        <Button @click="dealFlowSubmit();" type="info">确定</Button>
      </div>
    </Modal>

  </div>
</template>
<script>
import { autoheight , objTotext} from "../../../static/js/tool.js";
export default {
  data() {
    return {
      autoheight:400,
      flowParamsItem: {
        fdId: "",
        taskId: "",
        taskKey: "",
        handleUser: "",
        handleUserName: "",
      },
      taskParamList: [],
      totalSize: 0,
      pageSize: 20,
      page: 1,
      modalStart: false,
      loading: true,
      text: "",
      tableColumns: [
        {
          title: "任务ID",
          key: "taskId",
          align: "center",
        },
        {
          title: "任务key",
          key: "taskDefinitionKey",
          align: "center",
        },
        {
          title: "任务名称",
          key: "taskName",
          align: "center",
          render: (h, params) => {
            return h("div",params.row.taskName);
          }
        },
        {
          title: "流程ID",
          key: "fdId",
          align: "center",
        },
        {
          title: "实例ID",
          key: "instanceId",
          align: "center",
        },
        {
          title: "操作",
          key: "action",
          width: 230,
          align: "center",
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px"
                  },
                  on: {
                    click: () => {
                      this.dealFlow(params.row);
                    }
                  }
                },
                "处理"
              )
            ]);
          }
        }
      ],
      tableData: []
    };
  },
  mounted() {
    this.initData();
    autoheight(this,180)
  },
  methods: {
    initData() {
      this.loading = true;
      this.$http.post("/api/flow/actflow/task/getTask",{
         pageNum: this.page,
         pageSize: this.pageSize,
      }).then(res => {
        this.tableData = res.retBody;
        this.totalSize = res.retBody.total;
        this.loading = false;
      });
    },
    initParamData(row){
      this.$http.post("/api/flow/bizflow/taskparam/getTaskParam",{
         pageNum: this.page,
         pageSize: 1000,
         defId: row.fdId,
         taskKey: row.taskDefinitionKey
      }).then(res => {
         this.taskParamList = res.retBody.list
      });
    },
    /**
     * 处理流程
     */
    dealFlow(row) {

      console.log(row);

      this.modalStart = true;
      this.flowParamsItem.fdId = row.fdId;
      this.flowParamsItem.taskId = row.taskId;
      this.flowParamsItem.taskKey = row.taskDefinitionKey;
      this.flowParamsItem.handleUser = localStorage.getItem("username")=='undefined'?"":localStorage.getItem("username"),
      this.flowParamsItem.handleUserName = localStorage.getItem("realName")=='undefined'?"":localStorage.getItem("realName"),
      this.initParamData(row);

    },

    /**
     * 提交
     */
    dealFlowSubmit() {


      let parentObj = window.top.document;

      this.text = 'value:' + parentObj.documentElement.innerHTML; 

      window.parent.showMyModal();

      window.parent.printAcceptanceForm('{"business_id":"xxxx"}');

      const self = this;

      console.log(this.flowParamsItem);

      /**
      this.$http.post("/api/flow/actflow/task/deal", this.flowParamsItem).then(res => {
      if (res.retHead.code == "0000000") {
        this.modalStart = false;
        this.$Message.success({
          top: 100,
          duration: 1,
          content: res.retHead.message
        });
        this.initData();
      } else {
        this.$Message.warning({
          top: 100,
          duration: 1,
          content: res.retHead.message
        });
      }
      });
       */
    },

    cancel() {},
    /**
     * 改变页码
     */
    pageNum(page) {
      this.loading = true;
      this.page = page;
      this.initData();
    },
    /**
     * 改变每页的条数
     */
    pageSizeChange(pageSize) {
      this.loading = true;
      this.pageSize = pageSize;
      this.initData();
    },

  }
};
</script>

